﻿@model Nop.Web.Models.ShareBuy.ShareBuyItemListModel
@using Nop.Web;
@using Nop.Web.Extensions;
@{
    Layout = "~/Views/Shared/_ColumnsTwo.cshtml";

    //title
    Html.AddTitleParts("Share");
}
<link href="~/Themes/Jewelry/Content/css/share.css" rel="stylesheet" />
<script src="~/Scripts/masonry/jquery.masonry.min.js"></script>
<script src="~/Scripts/masonry/jquery.infinitescroll.min.js"></script>
<script>
    $(function () {
        var $container = $('#pictures');
        $container.masonry({
            itemSelector: '.sl-item'
        });
        $container.infinitescroll({
            navSelector: '#pager',    // selector for the paged navigation 
            nextSelector: '#pager a:first',  // selector for the NEXT link (to page 2)
            itemSelector: '.sl-item',     // selector for all items you'll retrieve
            loading: {
                finishedMsg: 'No more pages to load.',
                img: 'http://i.imgur.com/6RMhx.gif'
            }
        },
        // trigger Masonry as a callback
  function (newElements) {
      // hide new items while they are loading
      var $newElems = $(newElements).css({ opacity: 0 });
      // ensure that images load before adding to masonry layout
      $newElems.imagesLoaded(function () {
          // show elems now they're ready
          $newElems.animate({ opacity: 1 });
          $container.masonry('appended', $newElems, true);
      });
  }
);
    });
</script>
@section left {
    @Html.Action("ShareCategoryNavigation", "ShareBuy", new { currentCategoryId = 159/*159,177*/ })
}
<div class="sharebuylist">
    <div class="page-title">
        <table style="width: 100%;">
            <tr>
                <td class="title">
                    <h1>Share</h1>
                </td>
                <td class="shareSearchTag">
                    @if (Model.Q != null & Model.Q != "")
                    {
                        <span>The search result of ' @Model.Q '</span>
                    }
                </td>
                <td class="tdShareSearch">
                    @using (Html.BeginRouteForm("ShareBuyList", FormMethod.Get, new { onsubmit = "return check_small_search_form()" }))
                    {
                        <ul class="shareSearch">
                            <li>
                                @Html.TextBoxFor(model => model.Q, new { @class = "searchboxtext", id = "small-searchterms", @value = "Search Share", name = "q", onfocus = "if(this.value=='Search Share')this.value=''", onblur = "if(this.value=='') {this.value = 'Search Share';}" })
                                &nbsp; </li>
                            <li style="margin-left:-5px">
                                <input type="submit" class="searchboxbutton" id="btn-small-search" value="" />
                            </li>
                        </ul>

                        <script type="text/javascript">
                            function check_small_search_form() {
                                var search_terms = $("#small-searchterms");
                                if (search_terms.val() == "") {
                                    alert('@T("Search.EnterSearchTerms")');
                                    search_terms.focus();
                                    return false;
                                }

                                return true;
                            }
                        </script>
                    }
                </td>
            </tr>
        </table>
    </div>
    <div class="clear">
    </div>
    <div class="sharebuyitems">
        <div id="c-hot-show" class="m">
            <div class="mt mt-blue">
                @if (Model.ShareBuyItems.Count > 0)
                {
                    <div id="pictures" class="mc clearfix">
                        @foreach (var item in Model.ShareBuyItems)
                        {
                            <div class="sl-item">
                                <a target="_blank" href="@Url.RouteUrl("ShareBuyDetail", new { id = item.Id })" class="sl-p-img tc">
                                    <img alt="" src="@item.DefaultPictureModel.PictureUrl"@* height="@item.DefaultPictureModel.Height"*@>
                                </a><a target="_blank" href="@Url.RouteUrl("ShareBuyDetail", new { id = item.Id })" class="sl-desc">@item.Title
                                </a>
                                <div class="sl-comment clearfix">
                                    @foreach (var comment in item.ShareBuyCommentModels)
                                    {
                                        <s></s>
                                        <dl class="clearfix">
                                            <dt>
                                                <img width="34" height="34" alt="@comment.CustomerName" src="@comment.CustomerAvatarUrl" ></dt>
                                            <dd>
                                                <blockquote>@comment.CommentText</blockquote>
                                                <div class="sl-comment-meta">
                                                    @comment.CustomerName <em>@comment.CreatedOn</em>
                                                </div>
                                            </dd>
                                        </dl>
                                    }
                                </div>
                                <div class="sl-comment-data">
                                    <a class="goto-view" target="_blank" href="@Url.RouteUrl("ShareBuyDetail", new { id = item.Id })">Go to View</a> | <em>@item.NumberOfComments Comments</em>
                                </div>
                            </div>
                        }
                    </div>
                }
                else
                {
                    <span>Sorry, no share were found that matched your criteria. </span>
                }

            </div>
        </div>
    </div>
    <div id="pager">
        @Html.Pager(Model.PagingFilteringContext).QueryParam("pagenumber")
    </div>
</div>
